import styles from './index.less';
import { InputNumber } from 'antd';
import { useState } from 'react';
import common from '../../common';
export default props => {
  const [inputVisable, setInputVisable] = useState(false);

  return (
    <div
      onClick={() => {
        setInputVisable(true);
      }}
      className={styles.lableinputNumberbox}
    >
      <div className={styles.vouchermoney}>
        {common.getsplitSpan(props.value, 11, styles)}
      </div>
      {inputVisable ? (
        <div className={styles.handlerinput}>
          <InputNumber
            precision={2}
            min={0}
            max={999999999}
            autoFocus
            defaultValue={props.value}
            style={{
              width: '100%',
              height: '100%',
              textAlign: 'right',
              lineHeight: '62px',
              fontSize: '16px',
              letterSpacing: '5px',
            }}
            onBlur={event => {
              if (props.onFocusLeaves) {
                props.onFocusLeaves(event);
              }
              setInputVisable(false);
            }}
          />
        </div>
      ) : null}
    </div>
  );
};
